<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="../manager/base.jsp"%>
<script type="text/javascript" src="${ctx}/layui/layui.all.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx}/layui/css/layui.css">
<script type="text/javascript" src="${ctx}/js/layui_common.js"></script>
<!-- 上传图片所需要的css,js -->
<link href="${ctx}/css/uploadcss/iconfont.css" rel="stylesheet"
	type="text/css" />
<link href="${ctx}/css/uploadcss/fileUpload.css" rel="stylesheet"
	type="text/css">
<script type="text/javascript" src="${ctx}/js/uploadjs/fileUpload.js"></script>
<!-- end 上传图片所需要的css,js -->
<script type="text/javascript">
	$(function() {
		//自适应屏幕宽度
		var main_h = $(window).height();
		$('.hy_list').css('height', main_h - 45 + 'px');
		var main_w = $(window).width();
		$('.xjhy').css('width', main_w - 40 + 'px');
		$(".tabBox .tabCont:first").css("display", "block");
		$(".tabBox .tabNav li").click(
				function() {
					$(this).siblings("li").removeClass("now");
					$(this).addClass("now");
					$(this).parents(".tabBox").find(".tabCont").css("display",
							"none");
					var i = $(this).index();
					$(this).parents(".tabBox").find(".tabCont:eq(" + i + ")")
							.css("display", "block");
				});
		$('.xial_m span').click(function() {
			$(this).parent('.xial_m').siblings('.xl_ctn').toggle();
		});
	});
	<!--框架高度设置-->
</script>
<script type="text/javascript">
	$(function() {
		getInternalInfoByParam('', '');
		var selectHtml = getAllInterInfo('');
		$("select[name='device_name']").html(selectHtml);
	});

	function getAllInterInfo(id) {
		var optionHtml = "<option value=\"\">请选择</option>";
		$.ajax({
					url : '${ctx}/internal/getAllInterInfoByName',
					data : {},
					type : 'get',
					async : false,
					dataType : 'json',
					success : function(data) {
						if (data != null) {
							$
									.each(
											data,
											function(index, item) {
												if (item.id == id) {
													optionHtml += '<option value="'+item.id+'" selected="selected">'
															+ item.name
															+ '</option>';
												} else {
													optionHtml += '<option value="'+item.id+'">'
															+ item.name
															+ '</option>';
												}

											})

						}
					}
				});
		return optionHtml;
	}

	function getInternalInfoByName() {
		var name = $("input[name='name']").val();
		getInternalInfoByParam(name);
	}

	function getInternalInfoByParam(name) {
		var i;
		$.ajax({
					url : '${ctx}/internalInfo/getInternalInfoByParam',
					data : {
						"name" : name
					},
					type : 'get',
					dataType : 'json',
					beforeSend : function() {
						i = layer.open({
							type : 3,
							area : '500px',
							skin : 'layui-layer-molv',
							shade : 0.5,
							shadeClose : true,
							maxmin : true
						});
					},
					success : function(data) {
						layer.close(i);
						$("#qrcodeInfo").html("");
						if (data != null) {
							$.each(
											data,
											function(index, item) {
												var html = "";
												html += "<tr>";
												html += "<td>" + item.devicename + "</td>"; 
												html += "<td>" + item.name + "</td>"; 
												html += "<td>" + item.content
														+ "</td>";
												html += "<td>" + item.dlcode
														+ "</td>";
												if (item.dlimg == ""
														|| item.dlimg == null) {
													html += "<td> </td>";
												} else {
													html += "<td><img src=\""+item.dlimg+"\" style=\"width:20px;height:20px;\"/></td>";
												}
												html += "<td>" + item.pxtcode
														+ "</td>";
												if (item.pxtimg == ""
														|| item.pxtimg == null) {
													html += "<td> </td>";
												} else {
													html += "<td><img src=\""+item.pxtimg+"\" style=\"width:20px;height:20px;\"/></td>";
												}
												html += "<td>" + item.nbcode
														+ "</td>";
												if (item.nbimg == ""
														|| item.nbimg == null) {
													html += "<td> </td>";
												} else {
													html += "<td><img src=\""+item.nbimg+"\" style=\"width:20px;height:20px;\"/></td>";
												}
												html += "<td>";
												html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"updateInternal('"
														+ item.uuid
														+ "')\">修改</a>";
												html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"deleteInternal('"
														+ item.uuid
														+ "')\">删除</a>";
												html += "</td>";
												html += "</tr>";
												$("#qrcodeInfo").append(html);
											});
						}
						//添加分页
						//计算总数
						var total = 0;
						if (data == null) {
							total = 0;
						} else if (data.length == 0 || data[0].cnt == null
								|| data[0].cnt == ""
								|| data[0].cnt == undefined) {
							total = 0;
						} else {
							total = data[0].cnt;
						}
						//定义一个laypage实例
						var laypage = layui.laypage;
						laypage
								.render({
									elem : 'r_foot_m', //注意，这里的 test1 是 ID，不用加 # 号
									count : total,
									prev : '上一页',
									next : '下一页',
									cont : 'claimpage',
									skin : 'yahei',
									jump : function(obj, first) {
										if (first != true) {//是否首次进入页面
											var currentPage = obj.curr;//获取点击的页码
											//通过当前页数，获取对应的数据
											$
													.ajax({
														url : '${ctx}/internalInfo/getInternalInfoByParam',
														data : {
															"name" : name,
															"page" : currentPage
														},
														type : 'get',
														dataType : 'json',
														beforeSend : function() {
															i = layer
																	.open({
																		type : 3,
																		area : '500px',
																		skin : 'layui-layer-molv',
																		shade : 0.5,
																		shadeClose : true,
																		maxmin : true
																	});
														},
														success : function(data) {
															layer.close(i);
															$("#qrcodeInfo")
																	.html("");
															if (data != null) {
																$.each(
																				data,
																				function(
																						index,
																						item) {
																					var html = "";
																					html += "<tr>";
																					html += "<td>" + item.devicename + "</td>"; 
																					html += "<td>" + item.name + "</td>";
																					html += "<td>" + item.content + "</td>";
																					html += "<td>" + item.dlcode + "</td>";
																					if (item.dlimg == ""
																							|| item.dlimg == null) {
																						html += "<td> </td>";
																					} else {
																						html += "<td><img src=\""+item.dlimg+"\" style=\"width:20px;height:20px;\"/></td>";
																					}
																					html += "<td>"
																							+ item.pxtcode
																							+ "</td>";
																					if (item.pxtimg == ""
																							|| item.pxtimg == null) {
																						html += "<td> </td>";
																					} else {
																						html += "<td><img src=\""+item.pxtimg+"\" style=\"width:20px;height:20px;\"/></td>";
																					}
																					html += "<td>"
																							+ item.nbcode
																							+ "</td>";
																					if (item.nbimg == ""
																							|| item.nbimg == null) {
																						html += "<td> </td>";
																					} else {
																						html += "<td><img src=\""+item.nbimg+"\" style=\"width:20px;height:20px;\"/></td>";
																					}
																					html += "<td>";
																					html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"updateInternal('"
																							+ item.uuid
																							+ "')\">修改</a>";
																					html += "<a href=\"javascript:void(0);\" class=\"btn\" onclick=\"deleteInternal('"
																							+ item.uuid
																							+ "')\">删除</a>";
																					html += "</td>";
																					html += "</tr>";
																					$(
																							"#qrcodeInfo")
																							.append(
																									html);
																				});
															}
														}
													});
										}
									}
								});
					}
				});
	}
</script>
<script type="text/javascript">
	//打开弹框
	var index;
	function updateInternal(uuid) {
		//通过id查询角色信息
		$.ajax({
					url : '${ctx}/internalInfo/getInternalInfoByParam',
					data : {
						"uuid" : uuid
					},
					type : 'get',
					dataType : 'json',
					async : false,
					success : function(data) {
						//添加下拉内容
						$
								.each(
										data,
										function(index, item) {
											if (data != null) {
												var html = "";
												html += '<div class="tabCont">';
												html += '<input type="hidden" id="updateuuid" value="'+item.uuid+'"/>';
												html += '<ul class="hypz">';

												html += '	<li class="clearfix"><span class="title">设备名称：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="updatename" type="text" value="'+item.name+'"> <i>*</i> ';
												html += '		</div></li>';

												html += '	<li class="clearfix"><span class="title">内容：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="updatecontent" type="text" value="'+item.content+'"> <i>*</i> ';
												html += '		</div></li>';

												html += '	<li class="clearfix"><span class="title">电路图号：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="updatedlcode" type="text" value="'+item.dlcode+'"> <i>*</i>';
												html += '		</div></li>';

												html += '	<li class="clearfix" style="height:330px;"><span class="title">logo图片：</span>';
												html += '		<div class="li_r">';
												if (item.dlimg == ""
														|| item.dlimg == null) {
													html += "<td></td>";
												} else {
													html += "<td><img src=\""+item.dlimg+"\" style=\"width:50px;height:50px;\"/></td>";
												}

												html += '			<div id="update_fileUploadContent" class="fileUploadContent"></div>';
												html += '		</div>';
												html += '	</li>';

												html += '	<li class="clearfix"><span class="title">配线图号：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="updatepxtcode" type="text" value="'+item.pxtcode+'"> <i>*</i>';
												html += '		</div></li>';

												html += '	<li class="clearfix" style="height:330px;"><span class="title">logo图片：</span>';
												html += '		<div class="li_r">';
												if (item.pxtimg == ""
														|| item.pxtimg == null) {
													html += "<td></td>";
												} else {
													html += "<td><img src=\""+item.pxtimg+"\" style=\"width:50px;height:50px;\"/></td>";
												}

												html += '			<div id="update_fileUploadContent1" class="fileUploadContent"></div>';
												html += '		</div>';
												html += '	</li>';

												html += '	<li class="clearfix"><span class="title">内部图号：</span>';
												html += '		<div class="li_r">';
												html += '			<input class="chang" name="updatenbcode" type="text" value="'+item.nbcode+'"> <i>*</i>';
												html += '		</div></li>';

												html += '	<li class="clearfix" style="height:330px;"><span class="title">logo图片：</span>';
												html += '		<div class="li_r">';
												if (item.nbimg == ""
														|| item.nbimg == null) {
													html += "<td></td>";
												} else {
													html += "<td><img src=\""+item.nbimg+"\" style=\"width:50px;height:50px;\"/></td>";
												}

												html += '			<div id="update_fileUploadContent2" class="fileUploadContent"></div>';
												html += '		</div>';
												html += '	</li>';

												html += '	<li class="tj_btn"><a href="javascript:void(0);" onclick="updateInternalInfo();">修改</a></li>';
												html += '</ul>';
												html += '</div>';
												html += '<script>';
												html += '	$("#update_fileUploadContent").initUpload({';
												html += '		"maxFileNumber":1,';
												html += '		"beforeUpload": beforeUpdateUploadFun,';
												html += '		"fileType": [\'png\', \'jpg\', \'jpeg\',\'gif\']';
												html += '	});';
												html += '	function beforeUpdateUploadFun(opt) {';
												html += '		opt.otherData = [{';
												html += '			"name": "name",';
												html += '			"value": "zxm"';
												html += '		}];';
												html += '	}';
												html += '	$("#update_fileUploadContent1").initUpload({';
												html += '		"maxFileNumber":1,';
												html += '		"beforeUpload": beforeUpdateUploadFun,';
												html += '		"fileType": [\'png\', \'jpg\', \'jpeg\',\'gif\']';
												html += '	});';
												html += '	$("#update_fileUploadContent2").initUpload({';
												html += '		"maxFileNumber":1,';
												html += '		"beforeUpload": beforeUpdateUploadFun,';
												html += '		"fileType": [\'png\', \'jpg\', \'jpeg\',\'gif\']';
												html += '	});';
												html += '	function beforeUpdateUploadFun(opt) {';
												html += '		opt.otherData = [{';
												html += '			"name": "name",';
												html += '			"value": "zxm"';
												html += '		}];';
												html += '	}';
												html += '<\/script>';

												//打开弹框，显示
												index = layer
														.open({
															type : 1,
															title : '修改设备信息',
															area : [ '600px',
																	'500px' ],
															shadeClose : true, //点击遮罩关闭
															content : html
														});
											}
										});
					}
				});
	}

	function updateInternalInfo() {
		var i;
		var uuid = $("#updateuuid").val();
		var name = $("input[name='updatename']").val();
		if (name == null || name == "" || name == undefined) {
			//提示不能为空
			layer.alert("设备名称不能为空!");
			return;
		}
		var content = $("input[name='updatecontent']").val();
		var dlcode = $("input[name='updatedlcode']").val();
		var pxtcode = $("input[name='updatepxtcode']").val();
		var nbcode = $("input[name='updatenbcode']").val();

		var form = new FormData();
		form.append('uuid', uuid);
		form.append('name', name);
		form.append('content', content);
		form.append('dlcode', dlcode);
		form.append('pxtcode', pxtcode);
		form.append('nbcode', nbcode);

		var opt = uploadTools.getOpt("update_fileUploadContent");
		var fileList = uploadFileList.getFileList(opt);
		var fileNumber = uploadTools.getFileNumber(opt);
		if (fileNumber > 0) {
			form.append("dlimg", fileList[0]);
		}
		var opt1 = uploadTools.getOpt("update_fileUploadContent1");
		//查看文件是否存在
		var fileList1 = uploadFileList.getFileList(opt1);
		var fileNumber1 = uploadTools.getFileNumber(opt1);
		if (fileNumber1 > 0) {
			form.append("pxtimg", fileList1[0]);
		}
		var opt2 = uploadTools.getOpt("update_fileUploadContent2");
		//查看文件是否存在
		var fileList2 = uploadFileList.getFileList(opt2);
		var fileNumber2 = uploadTools.getFileNumber(opt2);
		if (fileNumber2 > 0) {
			form.append("nbimg", fileList2[0]);
		}
		$.ajax({
			url : '${ctx}/internalInfo/updateInternalInfo',
			data : form,
			type : 'post',
			processData : false,
			contentType : false,
			cache : false,
			dataType : 'html',
			beforeSend : function() {
				i = layer.open({
					type : 3,
					area : '500px',
					skin : 'layui-layer-molv',
					shade : 0.5,
					shadeClose : true,
					maxmin : true
				});
			},
			success : function(data) {
				layer.close(i);
				if (data == "success") {
					layer.alert("修改成功!", function() {
						window.location.reload();
						parent.layer.close(index);
					});
				}
			}
		});
	}
</script>
<script type="text/javascript">
	//删除大学信息
	function deleteInternal(uuid) {
		layer.confirm('确定要删除这条记录吗?', {
			icon : 3,
			title : '提示'
		}, function(index) {
			$.ajax({
				url : '${ctx}/internalInfo/deleteInternalInfo',
				data : {
					"uuid" : uuid
				},
				type : 'post',
				dataType : 'html',
				success : function(data) {
					if (data == "success") {
						layer.alert("删除成功!", function() {
							window.location.reload();
							parent.layer.close(index);
						});
					} else if (data == "nopass") {
						layer.alert("没有权限添加,请联系管理员!");
					} else if (data == "error") {
						layer.alert("删除异常,请联系管理员!");
					}
				}
			});
		});
	}
</script>
<script type="text/javascript">
	function addInternalInfo() {
		var i;
		var internalid = $("select[name='device_name'] option:selected").val();
		var name = $("input[name='addname']").val();
		if (name == null || name == "" || name == undefined) {
			//提示不能为空
			layer.alert("电源名称不能为空!");
			return;
		}
		var content = $("input[name='content']").val();
		var dlcode = $("input[name='dlcode']").val();
		var pxtcode = $("input[name='pxtcode']").val();
		var nbcode = $("input[name='nbcode']").val();
		var form = new FormData();
		form.append('internalid', internalid);
		form.append('name', name);
		form.append('content', content);
		form.append('dlcode', dlcode);
		form.append('pxtcode', pxtcode);
		form.append('nbcode', nbcode);
		var opt = uploadTools.getOpt("fileUploadContent");
		//查看文件是否存在
		var fileList = uploadFileList.getFileList(opt);
		var fileNumber = uploadTools.getFileNumber(opt);
		if (fileNumber > 0) {
			form.append("dlimg", fileList[0]);
		}
		var opt1 = uploadTools.getOpt("fileUploadContent1");
		//查看文件是否存在
		var fileList1 = uploadFileList.getFileList(opt1);
		var fileNumber1 = uploadTools.getFileNumber(opt1);
		if (fileNumber1 > 0) {
			form.append("pxtimg", fileList1[0]);
		}

		var opt2 = uploadTools.getOpt("fileUploadContent2");
		//查看文件是否存在
		var fileList2 = uploadFileList.getFileList(opt2);
		var fileNumber2 = uploadTools.getFileNumber(opt2);
		if (fileNumber2 > 0) {
			form.append("nbimg", fileList2[0]);
		}
		$.ajax({
			url : '${ctx}/internalInfo/addInternalInfo',
			data : form,
			type : 'post',
			processData : false,
			contentType : false,
			cache : false,
			dataType : 'html',
			beforeSend : function() {
				i = layer.open({
					type : 3,
					area : '500px',
					skin : 'layui-layer-molv',
					shade : 0.5,
					shadeClose : true,
					maxmin : true
				});
			},
			success : function(data) {
				layer.close(i);
				if (data == "success") {
					layer.alert("添加成功!", function() {
						window.location.reload();
						parent.layer.close(index);
					});
				} else if (data == "nopass") {
					layer.alert("没有权限添加,请联系管理员!");
				} else if (data == "error") {
					layer.alert("添加异常,请联系管理员!");
				}
			}
		});
	}
</script>
<div id="right_ctn">
	<div class="right_m">
		<!--列表-->
		<div class="hy_list">
			<div class="box_t">
				<span class="name">设备列表</span>
				<!--当前位置-->
				<div class="position">
					<a href=""><img src="${ctx}/images/icon5.png" alt="" /></a> <a
						href="">首页</a> <span><img src="${ctx}/images/icon3.png"
						alt="" /></span> <a href="">设备管理</a> <span><img
						src="${ctx}/images/icon3.png" alt="" /></span> <a href="">设备列表</a>
				</div>
				<!--当前位置-->
			</div>

			<!--新建-->
			<form action="" method="post">
				<div class="xjhy" style="padding: 0px;">
					<div class="tabBox_t">
						<div class="tabBox">
							<ul class="tabNav">
								<li class="now"><span>所有设备</span></li>
								<li><span>添加设备</span></li>
							</ul>
							<div class="tabCont" style="display: block;">
								<!--所有学校-->
								<ul class="hypz gjpz clearfix">
									<!--查询-->
									<div class="search">
										<span>按设备名称查询：</span>
										<div class="s_text">
											<input name="name" type="text">
										</div>
										<a href="javascript:void(0);" class="btn"
											onclick="getInternalInfoByName()">查询</a>
									</div>
									<!--查询-->
									<div class="space_hx">&nbsp;</div>
									<!--列表-->
									<form action="" method="post">
										<table cellpadding="0" cellspacing="0" class="list_hy"
											style="width: 98%;">
											<tr>
												<th scope="col">设备名称</th>
												<th scope="col">电源名称</th>
												<th scope="col">内容</th>
												<th scope="col">电路图号</th>
												<th scope="col">电路图</th>
												<th scope="col">配线图号</th>
												<th scope="col">配线图</th>
												<th scope="col">内部图号</th>
												<th scope="col">内部图</th>
												<th scope="col">操作</th>
											</tr>
											<tbody id="qrcodeInfo">
											</tbody>
										</table>
										<!--列表-->
										<!--右边底部-->
										<div class="r_foot">
											<div class="r_foot_m" id="r_foot_m"></div>
										</div>
									</form>
									<!--右边底部-->
								</ul>
								<!--所有权限-->
							</div>
							<div class="tabCont" style="">
								<!--添加权限-->
								<ul class="hypz">
									<li class="clearfix"><span class="title">设备名称：</span>
										<div class="li_r">
											<select name="device_name" lay-verify="">
												<option value="">请选择</option>
											</select> <i>*</i>
										</div></li>
									<li class="clearfix"><span class="title">电源名称：</span>
										<div class="li_r">
											<input class="chang" name="addname" type="text"> <i>*</i>
										</div></li>
									<li class="clearfix"><span class="title">内容：</span>
										<div class="li_r">
											<input class="chang" name="content" type="text"> <i>*</i>
										</div></li>
									<li class="clearfix"><span class="title">电路图号：</span>
										<div class="li_r">
											<input class="chang" name="dlcode" type="text"> <i>*</i>
										</div></li>
									<!-- <li class="clearfix"><span class="title">学校简介：</span>
										<div class="li_r">
											<input class="chang" name="introduce" type="text"> <i>*</i>
										</div></li> -->
									<li class="clearfix" style="height: 280px;"><span
										class="title">电路图：</span>
										<div class="li_r">
											<div id="fileUploadContent" class="fileUploadContent"></div>
										</div></li>
									<li class="clearfix"><span class="title">配线图号：</span>
										<div class="li_r">
											<input class="chang" name="pxtcode" type="text"> <i>*</i>
										</div></li>
									<li class="clearfix" style="height: 280px;"><span
										class="title">配线图：</span>
										<div class="li_r">
											<div id="fileUploadContent1" class="fileUploadContent"></div>
										</div></li>

									<li class="clearfix"><span class="title">内部图号：</span>
										<div class="li_r">
											<input class="chang" name="nbcode" type="text"> <i>*</i>
										</div></li>
									<li class="clearfix" style="height: 280px;"><span
										class="title">内部图：</span>
										<div class="li_r">
											<div id="fileUploadContent2" class="fileUploadContent"></div>
										</div></li>
									<li class="tj_btn"><a href="javascript:void(0);"
										onclick="addInternalInfo();">添加</a></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</form>
		</div>
		<!--列表-->
	</div>
</div>
<script type="text/javascript">
	$("#fileUploadContent").initUpload({
		//"uploadUrl": "#", //上传文件信息地址
		//"size":350,//文件大小限制，单位kb,默认不限制
		"maxFileNumber" : 1,//文件个数限制，为整数
		//"filelSavePath":"",//文件上传地址，后台设置的根目录
		"beforeUpload" : beforeUploadFun, //在上传前执行的函数
		//"onUpload":onUploadFun，//在上传后执行的函数
		//autoCommit:true,//文件是否自动上传
		"fileType" : [ 'png', 'jpg', 'jpeg', 'gif' ]
	//文件类型限制，默认不限制，注意写的是文件后缀
	});
	$("#fileUploadContent1").initUpload({
		//"uploadUrl": "#", //上传文件信息地址
		//"size":350,//文件大小限制，单位kb,默认不限制
		"maxFileNumber" : 1,//文件个数限制，为整数
		//"filelSavePath":"",//文件上传地址，后台设置的根目录
		"beforeUpload" : beforeUploadFun, //在上传前执行的函数
		//"onUpload":onUploadFun，//在上传后执行的函数
		//autoCommit:true,//文件是否自动上传
		"fileType" : [ 'png', 'jpg', 'jpeg', 'gif' ]
	//文件类型限制，默认不限制，注意写的是文件后缀
	});
	$("#fileUploadContent2").initUpload({
		//"uploadUrl": "#", //上传文件信息地址
		//"size":350,//文件大小限制，单位kb,默认不限制
		"maxFileNumber" : 1,//文件个数限制，为整数
		//"filelSavePath":"",//文件上传地址，后台设置的根目录
		"beforeUpload" : beforeUploadFun, //在上传前执行的函数
		//"onUpload":onUploadFun，//在上传后执行的函数
		//autoCommit:true,//文件是否自动上传
		"fileType" : [ 'png', 'jpg', 'jpeg', 'gif' ]
	//文件类型限制，默认不限制，注意写的是文件后缀
	});
	function beforeUploadFun(opt) {
		opt.otherData = [ {
			"name" : "name",
			"value" : "zxm"
		} ];
	}
</script>